<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://"
			+ request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>福建东侨政府网</title>
<meta name="Keywords"
	content="东侨由来 “四时多燠”（气候素有“万紫千红花不谢，冬暖夏凉四序春”美誉），故称东侨。地处福建省东南部，晋江东溪上游。东邻仙游，南接南安、安溪，西连漳平，北与德化、大田交界。">
<meta name="description"
	content="东侨由来 “四时多燠”（气候素有“万紫千红花不谢，冬暖夏凉四序春”美誉），故称东侨。地处福建省东南部，晋江东溪上游。东邻仙游，南接南安、安溪，西连漳平，北与德化、大田交界。">
<link href="css/main.css" rel="stylesheet" type="text/css">
<link href="css/index.css" rel="stylesheet" type="text/css">
<script src="js/jquery-1.10.2.min.js"></script>
<script src="js/jquery.sudoSlider.min.js"></script>
<script src="js/public.js"></script>
<script type="text/javascript">
			function ajaxClick(type){
					$.ajax({
					type:'POST',
					url:'public/article/view',
					data:{'id':'${article.id}','type':type},
					dataType:'json',
					 success:function(data){
								if(data && data.success){
										alert(data.msg);
									switch(type){
									case 1:
										$(".aboutList .zhichi span").html("("+data.object.supportNum+")");
										break;
									case 2:
										$(".aboutList .fandui span").html("("+data.object.opposeNum+")");
									break;
									case 3:
										$(".aboutList .collect span").html("("+data.object.collectNum+")");
									break;
									}
								}else{
									alert(data.msg);
								}},
								error:function(data){
									alert(data.msg);
								} 
				});
			}
			
			function ajaxComment(){
					$.ajax({
					type:'POST',
					url:'expose/article/comment',
					data:{'articleId':'${article.id}','commentContent':$(".pinglun-content").html()},
					dataType:'json',
					 success:function(data){
								if(data && data.success){
										alert(data.msg);
										$(".pinglun-list").prepend("<li><div class=\"pinglun-date\">xx评论时间:&nbsp;&nbsp;"+formatDate(data.object.commentDate)+"</div><div class=\"pinglun-comment\">"+data.object.commentContent+"</div></li>");
								}else{
									alert(data.msg);
								}},
								error:function(data){
									alert(data.msg);
								} 
				});
			}
			
				function doZoom(size) {
					document.getElementById('zoom').style.fontSize = size+ 'px';
				}
</script>
</head>
<body>
	in<jsp:include page="/jsp/top.jsp"></jsp:include>
	<div class="yc_container">
			<div class="yc_content_inner">
				<div class="showCon">
				<h1>${article.articleName}</h1>
				<h3>
					时间：
					<fmt:formatDate value="${article.createDate}"
						pattern="yyyy-MM-dd HH:mm:ss" />
					&nbsp;&nbsp;来源：${article.user.chinaName} &nbsp;&nbsp;<font
						color="#ff0000">字体显示：</font><a onclick="javascript:doZoom(18)"
						style="cursor:hand">大</a> <a onclick="javascript:doZoom(16)"
						style="cursor:hand">中</a> <a onclick="javascript:doZoom(12)"
						style="cursor:hand">小 </a>&nbsp;&nbsp;&nbsp;阅读：${article.clickRate
					} 次
				</h3>
				<div >
				<p class="p0" style="color:#333333;font-family:'Microsoft Yahei';font-size:14px;background-color:#FFFFFF;text-indent:32pt;">
					<span  id="zoom" style="font-family:SimSun;font-size:14px;">${article.articleContent}</span>
				</p>
				</div>
					<div class="aboutList">
							<a class="zhichi" href="javascript:void(0);" onclick="ajaxClick(1);">支持一下<span>(${article.supportNum})</span></a>
							<a class="fandui" href="javascript:void(0);" onclick="ajaxClick(2);">我要吐槽<span>(${article.opposeNum})</span></a>
							<a class="collect" href="javascript:void(0);" onclick="ajaxClick(3);">收藏次数<span>(${article.collectNum})</span></a>
					</div>
				 <div>
				 		<div class="comment">
				 			<div class="pinglun-content" contenteditable="true">来说两句吧...</div>
				 				<div  class="biaoqing-fabu" >
					 				<div class="biaoqing">
					 					<a href="javascript:void(0);" >插入表情</a>
					 				</div>
						 			<div>
						 				<a href="javascript:void(0);" class="fabu" onclick="ajaxComment();">评&nbsp;&nbsp;论</a>
						 			</div>
				 				</div>
				 		</div>最新评论
				 		<div class="pinglun-list">
				 		<ul>
				 		<c:forEach items="${comments }" var="comment">
				 				<li>
				 					<div class="pinglun-date">xx评论时间:&nbsp;&nbsp;<fmt:formatDate value="${comment.commentDate}"
						pattern="yyyy-MM-dd HH:mm:ss" /></div>
				 					<div class="pinglun-comment">${comment.commentContent }</div>
				 				</li>
				 		</c:forEach>
				 		</ul>
				 		</div>
				 </div>
				</div>
			</div>
	</div>
	<jsp:include page="/jsp/bottom.jsp"></jsp:include>
</body>
</html>
